---
title: 部署你的 Astro 站点至 Google Firebase 托管
description: How to deploy your Astro site to the web using Google’s Firebase Hosting.
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'

[Firebase 托管](https://firebase.google.com/products/hosting) 是由 Google 的 [Firebase](https://firebase.google.com/) 应用开发平台提供的一项服务，可用于部署 Astro 站点。

如有必要的话请移步我们专门的指南，了解如何[集成 Firebase 后端服务](/zh-cn/guides/backend/google-firebase/)，例如数据库、身份验证和存储等。


## 项目配置

你的 Astro 项目可以作为一个静态网站，或者作为一个服务端渲染（SSR）网站部署到 Firebase 上。

### 静态网站

你的 Astro 项目默认是一个静态网站。所以你不需要任何额外配置就可以将静态 Astro 网站部署到 Firebase。

### SSR 适配器

要在你的 Astro 项目中启用 SSR 并部署到 Firebase，请添加 [Node.js 适配器](/zh-cn/guides/integrations-guide/node/)。

:::note
部署 SSR Astro 网站到 Firebase 需要开通 [Blaze 计划](https://firebase.google.com/pricing) 或更高级别。
:::

## 如何部署

1. 安装 [Firebase CLI](https://github.com/firebase/firebase-tools)。这是一个允许你在终端与 Firebase 交互的命令行工具。

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npm install firebase-tools
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm add firebase-tools
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn add firebase-tools
      ```
      </Fragment>
    </PackageManagerTabs>

2. 使用你的 Google 账号认证 Firebase CLI。这将打开一个浏览器窗口，你可以在其中登录到你的 Google 账号。

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase login
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase login
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase login
      ```
      </Fragment>
    </PackageManagerTabs>

3. 启用实验性的 web 框架支持。这是一个实验性功能，允许 Firebase CLI 检测并配置你的 Astro 部署设置。

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase experiments:enable webframeworks
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase experiments:enable webframeworks
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase experiments:enable webframeworks
      ```
      </Fragment>
    </PackageManagerTabs>

4. 在你的项目中初始化 Firebase 托管。这将在你的项目根目录中创建一个 `firebase.json` 和 `.firebaserc` 文件。

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase init hosting
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase init hosting
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase init hosting
      ```
      </Fragment>
    </PackageManagerTabs>

5. 将你的网站部署到 Firebase 托管。这将构建你的 Astro 网站并将其部署到 Firebase。

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npx firebase deploy --only hosting
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm exec firebase deploy --only hosting
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn firebase deploy --only hosting
      ```
      </Fragment>
    </PackageManagerTabs>
